<template>
	<view class="page">
		<view class="tips" v-show="isTip">
			<text class="mdText mgrey">每月可修改一次，本月您还可以再修改1次</text>
			
			<image src="../../../static/imgs/mine/close.png" mode="" class="close" @click="closeTip"></image>
		</view>
		
		<view class="inputLine">
			<input type="text" value="" placeholder="请输入姓名" class="md2Title mgrey inName"  maxlength="4"/>
			
			<view class="length md4Text">
				<text class="mblue">1</text>/4
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			isTip:true
		};
	},

	methods: {
		closeTip(){
			this.isTip = false;
		}
	}
};
</script>

<style scoped lang="less">
	.page{
		border-top: 2upx solid #E5E5E5;
		
		.tips{
			width: 694upx;
			height: 52upx;
			line-height: 52upx;
			// background: rgba(255, 106, 106, 0.2);
			margin: 20upx auto;
			position: relative;
			text{
				padding-left: 20upx;
			}
			
			.close{
				position: absolute;
				right: 10upx;
				top: 50%;
				width: 20upx;
				height: 20upx;
				transform: translateY(-50%);
			}
		}
		
		.inputLine{
			width: 694upx;
			margin: 30upx auto;
			border-bottom: 2upx solid #E5E5E5;
			display: flex;
			padding-bottom: 40upx;
			justify-content: space-between;
			.inName{
				font-size: 32upx;
			}
			.length{
				
			}
		}
	}
</style>
